﻿<!DOCTYPE html>
<html>
  <head>
    <title>气泡确认框 Popconfirm</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
    <meta name="viewport" content="width=1440, user-scalable=no"/>
    <meta name="format-detection" content="telephone=no"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <link href="resources/css/jquery-ui-themes.css" type="text/css" rel="stylesheet"/>
    <link href="resources/css/axure_rp_page.css" type="text/css" rel="stylesheet"/>
    <link href="data/styles.css" type="text/css" rel="stylesheet"/>
    <link href="files/______popconfirm/styles.css" type="text/css" rel="stylesheet"/>
    <link href="http://cdn.bootcss.com/font-awesome/4.7.0/css/font-awesome.css" type="text/css" rel="stylesheet"/>
    <script src="resources/scripts/jquery-1.7.1.min.js"></script>
    <script src="resources/scripts/jquery-ui-1.8.10.custom.min.js"></script>
    <script src="resources/scripts/prototypePre.js"></script>
    <script src="data/document.js"></script>
    <script src="resources/scripts/prototypePost.js"></script>
    <script src="files/______popconfirm/data.js"></script>
    <script type="text/javascript">
      $axure.utils.getTransparentGifPath = function() { return 'resources/images/transparent.gif'; };
      $axure.utils.getOtherPath = function() { return 'resources/Other.html'; };
      $axure.utils.getReloadPath = function() { return 'resources/reload.html'; };
    </script>
  </head>
  <body>
    <div id="base" class="">

      <!-- Unnamed (元件标题) -->

      <!-- 背景 (Dynamic Panel) -->
      <div id="u11372" class="ax_default" data-label="背景">
        <div id="u11372_state0" class="panel_state" data-label="State1" style="">
          <div id="u11372_state0_content" class="panel_state_content">
          </div>
        </div>
      </div>

      <!-- 线条 (Dynamic Panel) -->
      <div id="u11373" class="ax_default" data-label="线条">
        <div id="u11373_state0" class="panel_state" data-label="State1" style="">
          <div id="u11373_state0_content" class="panel_state_content">
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u11374" class="ax_default _默认样式">
        <div id="u11374_div" class=""></div>
        <div id="u11374_text" class="text ">
          <p><span style="font-family:'FontAwesome Bold', 'FontAwesome Regular', 'FontAwesome';"></span><span style="font-family:'微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';"> 元件标题</span></p>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u11375" class="ax_default _默认样式">
        <div id="u11375_div" class=""></div>
        <div id="u11375_text" class="text ">
          <p><span style="font-family:'FontAwesome';font-weight:400;"></span><span style="font-family:'微软雅黑';font-weight:400;"> </span><span style="font-family:'FontAwesome';font-weight:400;">作品首页</span></p>
        </div>
      </div>

      <!-- Unnamed (版权信息) -->

      <!-- Unnamed (Rectangle) -->
      <div id="u11377" class="ax_default _默认样式">
        <img id="u11377_img" class="img " src="images/___icons/u605.png"/>
        <div id="u11377_text" class="text ">
          <p><span>Copyright © </span><a id="u11378" class="link"><span>http://t.cn/EPh287q</span></a><span>, All Rights Reserved.</span></p><p><span>打造高保真原型，快人一步</span></p>
        </div>
      </div>

      <!-- Unnamed (Group) -->
      <div id="u11379" class="ax_default" data-left="20" data-top="100" data-width="1100" data-height="90">

        <!-- Unnamed (Rectangle) -->
        <div id="u11380" class="ax_default _默认样式">
          <div id="u11380_div" class=""></div>
          <div id="u11380_text" class="text ">
            <p style="font-size:14px;"><span style="font-family:'微软雅黑 Bold', '微软雅黑 Regular', '微软雅黑';font-weight:700;">使用说明</span></p><p style="font-size:12px;"><span style="font-family:'微软雅黑';font-weight:400;">点击元素弹出气泡式的确认框，目标元素的操作需要用户进一步的确认时，在目标元素附近弹出浮层提示，询问用户。和全屏居中模态对话框相比，交互形式更轻量。</span></p>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u11381" class="ax_default _默认样式">
          <div id="u11381_div" class=""></div>
          <div id="u11381_text" class="text ">
            <p><span></span></p>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u11382" class="ax_default _默认样式">
        <div id="u11382_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u11383" class="ax_default _默认样式">
        <div id="u11383_div" class=""></div>
        <div id="u11383_text" class="text ">
          <p><span>气泡确认框</span></p>
        </div>
      </div>

      <!-- 气泡确认框 (Dynamic Panel) -->
      <div id="u11384" class="ax_default" data-label="气泡确认框">
        <div id="u11384_state0" class="panel_state" data-label="State1" style="">
          <div id="u11384_state0_content" class="panel_state_content">

            <!-- Unnamed (Speech Bubble) -->
            <div id="u11385" class="ax_default _默认样式">
              <img id="u11385_img" class="img " src="images/______popconfirm/u11385.png"/>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11386" class="ax_default _默认样式">
              <div id="u11386_div" class=""></div>
              <div id="u11386_text" class="text ">
                <p style="font-size:16px;"><span style="font-family:'FontAwesome';font-weight:400;color:#FF992F;"></span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;color:#999999;"> </span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;">你确定删除这个任务吗？</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11387" class="ax_default _默认样式">
              <div id="u11387_div" class=""></div>
              <div id="u11387_text" class="text ">
                <p><span>确定</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11388" class="ax_default _默认样式">
              <div id="u11388_div" class=""></div>
              <div id="u11388_text" class="text ">
                <p><span>取消</span></p>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- 气泡确认框 (Dynamic Panel) -->
      <div id="u11389" class="ax_default" data-label="气泡确认框">
        <div id="u11389_state0" class="panel_state" data-label="State1" style="">
          <div id="u11389_state0_content" class="panel_state_content">

            <!-- Unnamed (Speech Bubble) -->
            <div id="u11390" class="ax_default _默认样式">
              <img id="u11390_img" class="img " src="images/______popconfirm/u11385.png"/>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11391" class="ax_default _默认样式">
              <div id="u11391_div" class=""></div>
              <div id="u11391_text" class="text ">
                <p style="font-size:16px;"><span style="font-family:'FontAwesome';font-weight:400;color:#FF992F;"></span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;color:#999999;"> </span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;">你确定删除这个任务吗？</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11392" class="ax_default _默认样式">
              <div id="u11392_div" class=""></div>
              <div id="u11392_text" class="text ">
                <p><span>确定</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11393" class="ax_default _默认样式">
              <div id="u11393_div" class=""></div>
              <div id="u11393_text" class="text ">
                <p><span>取消</span></p>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- 气泡确认框 (Dynamic Panel) -->
      <div id="u11394" class="ax_default" data-label="气泡确认框">
        <div id="u11394_state0" class="panel_state" data-label="State1" style="">
          <div id="u11394_state0_content" class="panel_state_content">

            <!-- Unnamed (Speech Bubble) -->
            <div id="u11395" class="ax_default _默认样式">
              <img id="u11395_img" class="img " src="images/______popconfirm/u11395.png"/>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11396" class="ax_default _默认样式">
              <div id="u11396_div" class=""></div>
              <div id="u11396_text" class="text ">
                <p style="font-size:16px;"><span style="font-family:'FontAwesome';font-weight:400;color:#FF992F;"></span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;color:#999999;"> </span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;">你确定删除这个任务吗？</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11397" class="ax_default _默认样式">
              <div id="u11397_div" class=""></div>
              <div id="u11397_text" class="text ">
                <p><span>确定</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11398" class="ax_default _默认样式">
              <div id="u11398_div" class=""></div>
              <div id="u11398_text" class="text ">
                <p><span>取消</span></p>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- 气泡确认框 (Dynamic Panel) -->
      <div id="u11399" class="ax_default" data-label="气泡确认框">
        <div id="u11399_state0" class="panel_state" data-label="State1" style="">
          <div id="u11399_state0_content" class="panel_state_content">

            <!-- Unnamed (Speech Bubble) -->
            <div id="u11400" class="ax_default _默认样式">
              <img id="u11400_img" class="img " src="images/______popconfirm/u11395.png"/>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11401" class="ax_default _默认样式">
              <div id="u11401_div" class=""></div>
              <div id="u11401_text" class="text ">
                <p style="font-size:16px;"><span style="font-family:'FontAwesome';font-weight:400;color:#FF992F;"></span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;color:#999999;"> </span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;">你确定删除这个任务吗？</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11402" class="ax_default _默认样式">
              <div id="u11402_div" class=""></div>
              <div id="u11402_text" class="text ">
                <p><span>确定</span></p>
              </div>
            </div>

            <!-- Unnamed (Rectangle) -->
            <div id="u11403" class="ax_default _默认样式">
              <div id="u11403_div" class=""></div>
              <div id="u11403_text" class="text ">
                <p><span>取消</span></p>
              </div>
            </div>
          </div>
        </div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u11404" class="ax_default _默认样式">
        <div id="u11404_div" class=""></div>
      </div>

      <!-- Unnamed (Rectangle) -->
      <div id="u11405" class="ax_default _默认样式">
        <div id="u11405_div" class=""></div>
        <div id="u11405_text" class="text ">
          <p><span>气泡确认框使用示例</span></p>
        </div>
      </div>

      <!-- 气泡确认框 (Group) -->
      <div id="u11406" class="ax_default" data-label="气泡确认框" data-left="0" data-top="0" data-width="0" data-height="0">
      </div>

      <!-- 气泡确认框 (Group) -->
      <div id="u11407" class="ax_default" data-label="气泡确认框" data-left="430" data-top="775" data-width="120" data-height="40">

        <!-- 气泡确认框 (Dynamic Panel) -->
        <div id="u11408" class="ax_default ax_default_hidden" data-label="气泡确认框" style="display:none; visibility: hidden">
          <div id="u11408_state0" class="panel_state" data-label="State1" style="">
            <div id="u11408_state0_content" class="panel_state_content">

              <!-- Unnamed (Speech Bubble) -->
              <div id="u11409" class="ax_default _默认样式">
                <img id="u11409_img" class="img " src="images/______popconfirm/u11385.png"/>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u11410" class="ax_default _默认样式">
                <div id="u11410_div" class=""></div>
                <div id="u11410_text" class="text ">
                  <p style="font-size:16px;"><span style="font-family:'FontAwesome';font-weight:400;color:#FF992F;"></span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;color:#999999;"> </span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;">你确定删除这个任务吗？</span></p>
                </div>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u11411" class="ax_default _默认样式">
                <div id="u11411_div" class=""></div>
                <div id="u11411_text" class="text ">
                  <p><span>确定</span></p>
                </div>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u11412" class="ax_default _默认样式">
                <div id="u11412_div" class=""></div>
                <div id="u11412_text" class="text ">
                  <p><span>取消</span></p>
                </div>
              </div>
            </div>
          </div>
        </div>

        <!-- Unnamed (Rectangle) -->
        <div id="u11413" class="ax_default _默认样式">
          <div id="u11413_div" class=""></div>
          <div id="u11413_text" class="text ">
            <p><span>删除任务</span></p>
          </div>
        </div>
      </div>

      <!-- 气泡确认框 (Group) -->
      <div id="u11414" class="ax_default" data-label="气泡确认框" data-left="589" data-top="775" data-width="120" data-height="40">

        <!-- Unnamed (Rectangle) -->
        <div id="u11415" class="ax_default _默认样式">
          <div id="u11415_div" class=""></div>
          <div id="u11415_text" class="text ">
            <p><span>删除任务</span></p>
          </div>
        </div>

        <!-- 气泡确认框 (Dynamic Panel) -->
        <div id="u11416" class="ax_default ax_default_hidden" data-label="气泡确认框" style="display:none; visibility: hidden">
          <div id="u11416_state0" class="panel_state" data-label="State1" style="">
            <div id="u11416_state0_content" class="panel_state_content">

              <!-- Unnamed (Speech Bubble) -->
              <div id="u11417" class="ax_default _默认样式">
                <img id="u11417_img" class="img " src="images/______popconfirm/u11385.png"/>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u11418" class="ax_default _默认样式">
                <div id="u11418_div" class=""></div>
                <div id="u11418_text" class="text ">
                  <p style="font-size:16px;"><span style="font-family:'FontAwesome';font-weight:400;color:#FF992F;"></span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;color:#999999;"> </span><span style="font-family:'微软雅黑';font-weight:400;font-size:14px;">你确定删除这个任务吗？</span></p>
                </div>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u11419" class="ax_default _默认样式">
                <div id="u11419_div" class=""></div>
                <div id="u11419_text" class="text ">
                  <p><span>确定</span></p>
                </div>
              </div>

              <!-- Unnamed (Rectangle) -->
              <div id="u11420" class="ax_default _默认样式">
                <div id="u11420_div" class=""></div>
                <div id="u11420_text" class="text ">
                  <p><span>取消</span></p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </body>
</html>
